<!DOCTYPE html>
  <html>
  <head>
      <meta charset="utf-8">
      <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/>
      <title>title</title>
      <link rel="stylesheet" type="text/css" href="../css/api.css"/>
      <link rel="stylesheet" href="../css/public-head.css" />
      <style>
          body{


          }
          .Zhangice>div{
          	line-height: 50px;
          	 border-bottom: 1px solid rgba(131, 131, 139, 0.1);
          	 padding-left: 15px;
          }
          .mation_2{
          	letter-spacing: 6.5vw;
          }
          .Zhangice>div>div img{
          	height: 15px;
          	width: 8px;
          }
          .information_1{
          	display: flex;
          	padding-right: 15px;
          }
          .information_1>div:nth-child(1) {
          	flex: 3;
          }
          .information_1>div:nth-child(2) {
          	display:flex;
          	flex: 5;
          	color: #959595;
          	font-size: 14px;
          	justify-content: flex-start;
          }
          .information_1>div:nth-child(3) {
          	display: flex;
          	flex: 4;
          	justify-content: flex-end;
          	align-items: center;
          }

          .information_2{
          	display: flex;
          }
          .information_2>div:nth-child(1){
          	flex: 3;
          }
          .information_2>div:nth-child(2){
         	 flex: 4;
          }
     			.information_2>div:nth-child(3){
     				flex: 2;
     			}
      </style>
  </head>
  <body>
<div class="Zhangice">
	<div class="information_1">
		<div>品牌车系</div>
		<div>请选择品牌</div>
		<div>
			<img src="../image/icon/ARROWRIGHT@2x.png"/>
		</div>
	</div>
	<div class="information_1">
		<div class="mation_2">车系</div>
		<div>请选择车系</div>
		<div><img src="../image/icon/ARROWRIGHT@2x.png"/></div>
	</div>
	<div class="information_2">
		<div>车牌号码</div>
		<div>
			<select id="license_content1" name="license_name1"></select>
			<select id="license_content2" name="license_name2"></select>
		</div>
		<div><input type="text" placeholder="填写车牌号码" /></div>
	</div>
		<div class="information_1">
		<div>查询城市</div>
		<div>请选择查询城市</div>
		<div><img src="../image/icon/ARROWRIGHT@2x.png"/></div>
	</div>
</div>

  </body>
  <script type="text/javascript" src="../script/api.js"></script>
  <script type="text/javascript" src="../script/public-head.js"></script>
  <script type="text/javascript" src="../script/template-web.js"></script>
  <!-- 车牌渲染 -->
<script id="license" type="text/html">
	{{each list value i}}
	<option value="{{value}}">{{value}}</option>
	{{/each}}
</script>
<!-- 车牌字母渲染 -->
<script id="license2" type="text/html">
	{{each list value2 i}}
	<option value="{{value2}}">{{value2}}</option>
	{{/each}}
</script>
  <script type="text/javascript">
      apiready = function(){

      };
      headInner({
        title: "车辆信息",
        //headleft
        headl: '<a href="#" style="color:white" class="mui-icon mui-icon-left-nav" tapmode onclick="api.closeWin()"></a>',
        //headright
        headr: '<a style="color:white"></a>',
        color: "", //默认是蓝色
        padding: "0px 0px 0px",
    })
      	// 车牌
	var data = {
		list: ["桂", "京", "津", "沪", "渝", "冀", "豫", "云", "辽", "黑", "湘", "皖", "鲁", "新", "苏", "浙", "赣", "鄂", "甘", "晋", "蒙", "陕", "吉", "闽", "贵", "粤", "青", "藏", "川", "宁", "琼"]
	};
	var html = template('license', data);
	document.getElementById('license_content1').innerHTML = html;
	//车牌字母
	var data = {
		list: ["A", "B", "C", "D", "E", "F", "G", "H", "I", "J", "K", "L", "M", "N", "O", "P", "Q", "R", "S", "T", "U", "V", "W", "X", "Y", "Z"]
};
	var html = template('license2', data);
	document.getElementById('license_content2').innerHTML = html;

  </script>
  </html>
